<include file="Common:header" />
  <div class="content-wrapper">
    <!-- Content Header (Page header) -->
    <section class="content-header">
      <h1>
        权限管理
        <small><a href="{$listUrl}">{$actionTitle}</a></small>
      </h1>
      <ol class="breadcrumb">
        <li><a href="/"><i class="fa fa-dashboard"></i> Home</a></li>
        <li class="active">权限管理</li>
        <li class="active"><a href="{$listUrl}">{$actionTitle}</a></li>
      </ol>
    </section>

    <!-- Main content -->
    <section class="content">
      <div class="box">
        <form class="form-horizontal" method="post" id="roleForm">
          <div class="box-body">
            <div class="form-group">
              <label class="col-sm-2 control-label">名称:</label>
              <div class="col-sm-10">
                <input type="text" class="form-control" placeholder="角色名称" name="title">
              </div>
            </div>
            <div class="form-group">
              <label class="col-sm-2 control-label"><ins class="btn btn-danger btn-sm">说明:</ins></label>
              <div class="col-sm-10">
                <input type="text" class="form-control" placeholder="说明, 长度100个汉字以内。" name="content">
              </div>
            </div>
            <div class="form-group">
              <label class="col-sm-2 control-label"><ins class="btn btn-danger btn-sm">选择权限:</ins></label>
              <div class="col-sm-10">
                <table id="list" class="table table-bordered table-striped">
                  <div class="zTreeDemoBackground left">
                    <ul id="treeDemo" class="ztree"></ul>
                  </div>
                </table>
              </div>
            </div>
          </div>
          <!-- /.box-body -->
          <div class="box-footer">
            <div class="form-group">
              <label class="control-label col-sm-2">
                <a href="{$listUrl}" class="btn btn-default"><span class="fa fa-reply"></span>返回</a>
              </label>
              <input type="hidden" name="menuIdList">
              <label class="control-label"><button type="submit" class="btn btn-primary" id="save">创建</button></label>
            </div>
          </div>
          <!-- /.box-footer -->
        </form>
      </div>
    </section>
    <!-- /.content -->
  </div>
  <div class="control-sidebar-bg"></div>
</div>
<!-- ./wrapper -->
<include file="Common:footer" />
<script type="text/javascript">

  //提交form表单
  $("#save").click(function(){
    if(!$("input[name=title]").val()){
      alert('请填写角色名称!');
      return false;
    }

    //根据ztree的id获取ztree对象
    var treeObj = $.fn.zTree.getZTreeObj("treeDemo");

    //根据ztree上选中的节点,返回对象
    var nodes = treeObj.getCheckedNodes(true);

    var array = new Array();
    for(var i=0; i<nodes.length;i++){
      var id = nodes[i].id;
      array.push(id);
    }

    var menuIdList = array.join(",");
    if(!menuIdList){
      alert('请选择权限!');
      return false;
    }
    //为隐藏域赋值(权限id拼接字符串)
    $("input[name=menuIdList]").val(menuIdList);
    $("#roleForm").submit();
  })

  var zNodes = <?php echo $list;?>;

  var setting = {
    view: {
      selectedMulti: false,
    },
    check: {
      enable: true
    },
    data: {
      simpleData: {
        enable: true
      }
    },
    edit: {
      enable: true
    }
  };

  $(document).ready(function(){
    $.fn.zTree.init($("#treeDemo"), setting, zNodes);
  });

</script>
<!-- SlimScroll -->
</body>
</html>
